<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>会员中心</title>
    <link rel="shortcut icon" href="../../resources/image/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="../../resources/css/public.css">
    <link rel="stylesheet" href="memberusers.css">
    <link rel="stylesheet" href="../../resources/css/bootstrap-icons.css">
</head>

<body>
    <header>
        <div class="nav-bar">
            <a href="../../index.html" class="logo">Parking Lot</a>
            <div class="navigation">
                <div class="nav-items">
                    <a href="#"><i class="bi bi-search"></i>车位查询</a>
                    <a href="#"><i class="bi bi-paypal"></i>停车缴费</a>
                    <a href="#"><i class="bi bi-alarm"></i>车位预定</a>
                </div>
            </div>
            <div class="userslogin">
                <span>欢迎您，会员用户：</span><span>xxx</span><a href="javascript:;">退出</a>
            </div>
        </div>
    </header>

    <section>
        <div class="vip-body">
            <div class="vipimage"><img src="" alt=""></div>
            <div class="message-list">
                <div><span>车号：</span><span id="car_id">鄂xxxxx</span></div>
                <div><span>车位：</span><span id="booklotsnum">Axxx</span></div>
                <div>
                    <span>余额：</span><span id="balance">0000</span>
                    <a href="javascript:;" id="Recharge">充值</a>
                </div>
            </div>
            <div class="vipdetail">
                <div class="vipdetail-list">
                    <a href="javascript:;" class="active">车位查询<i class="bi bi-caret-right-fill"></i></a>
                    <a href="javascript:;">车位预定<i class="bi bi-caret-right-fill"></i></a>
                    <a href="javascript:;">停车缴费<i class="bi bi-caret-right-fill"></i></a>
                    <a href="javascript:;">停车信息<i class="bi bi-caret-right-fill"></i></a>
                    <a href="javascript:;">帐号信息<i class="bi bi-caret-right-fill"></i></a>
                </div>
                <div class="vipdetail-content">
                    <div class="car-place">
                        <h1>可用车位查询<i class="bi bi-arrow-down-right-square-fill"></i></h1>
                        <form action="javascript:;" method="get">
                            <input type="text" id="designated" placeholder="请输入指定车位号">
                            <input type="submit" id="designated_btn" value="查询">
                        </form>
                        <div>
                            <div class="place-btn">
                                <button class="btn-active">A区</button>
                                <button>B区</button>
                                <button>C区</button>
                            </div>
                            <div class="place-tips">
                                <span>空闲车位<i class="bi bi-circle-fill"></i></span>
                                <span>占用车位<i class="bi bi-circle-fill"></i></span>
                                <span>已预定<i class="bi bi-circle-fill"></i></span>
                                <span>维护中<i class="bi bi-circle-fill"></i></span>
                            </div>
                        </div>

                        <table></table>
                    </div>
                </div>
                <!-- 修改密码 -->
                <div class="pwdchange">
                    <div>请输入新密码：<input type="password" id="newpwd"></div>
                    <div>请确定新密码：<input type="password" id="renewpwd"></div>
                    <div><button>确定修改</button><button>取消</button></div>
                </div>
                <!-- 确定预订页面 -->
                <div class="fix-a-time">
                    <div>
                        <h2>您选择的车位：</h2>
                        <span>Axxx</span>
                    </div>
                    <div>
                        <p>请选择预定时长：</p>
                        <div class="pretime">
                            <button>1</button>
                            <button>3</button>
                            <button>7</button>
                            <button>30</button>
                            <input type="number" placeholder="输入整数">
                        </div>
                    </div>
                    <div class="YN">
                        <button>确定</button>
                        <button>取消</button>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <footer>
        <div class="about">
            <p>Make By Acaninchoi</p>
            <i class="bi bi-arrow-right-circle-fill"></i>
            <span>联系我</span>
            <a href="#"><i class="bi bi-envelope"></i></a>
            <a href="#"><i class="bi bi-telephone-inbound"></i></a>
            <a href="#"><i class="bi bi-github"></i></a>
        </div>
    </footer>

    <script src="../../resources/js/Ajax.js"></script>
    <script src="../../resources/js/common.js"></script>
    <script src="../../node_modules/jquery/dist/jquery.min.js"></script>
    <script src="MemberUsers.js"></script>
</body>

</html>